<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    @include('common-css')
    <style>

        .input_box {
            width: 100%;
            height: 40px;
            margin-top: 15px;
            margin-bottom: 15px;
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }

        .input_label {
            width: 120px;
            box-sizing: border-box;
        }

        .project-table {
            margin-top: 15px;
        }

        .status-tag {
            color: #1890ff;
            border: 1px solid #91d5ff;
            border-radius: 3px;
            background: #e6f7ff;
            font-size: 12px;
            padding: 2px 3px;
        }

        .ant-table-tbody > tr > td, .ant-table-thead > tr > th {
            vertical-align: middle;
            line-height: 25px;
        }

        .search_box {
            width: 1000px;
        }

        .search_box input {
            width: 300px;
        }

        .search_box button {
            margin-left: 20px;
        }

        .search_box .ant-select {
            margin-left: 20px;
        }
    </style>
</head>
<body>


<div id="app"></div>


<script id="appTemplate" type="x-template">
    <a-locale-provider :locale="antdLocale">
        <div class="container">

            @include('admin.header-tpl')

            <main>
                <div class="common_container">

                    @include('admin.aside-tpl')

                    <div class="common_content admin_common_content">
                        <a-tabs type="card">
                            <a-tab-pane key="1" tab="项目列表">
                                <div style="display: flex; position: relative; margin-top: 10px; align-items: center;">
                                    <!--@time 2020-06-15-->
                                    <!--@time 2020-06-15-->
                                    <!--@time 2020-06-15-->
                                    <a-button type="primary"
                                              size="small"
                                              @click="showExcelDialog('导出会评项目','meeting_review')"
                                              style="margin-left: 12px">
                                        导出项目信息
                                    </a-button>
                                    <!--@time 2020-06-15-->
                                    <!--@time 2020-06-15-->
                                    <!--@time 2020-06-15-->

                                    <span style="flex: 1;"></span>
                                    <a-input style="width: 300px;" placeholder="搜索" v-model="searchKeyword"/>
                                    <a-icon v-if="searchKeyword"
                                            style="position: absolute; top: 8px; right: 8px; color: #aaa; cursor: pointer;"
                                            type="cross"
                                            @click="searchKeyword = ''"/>
                                </div>
                                <a-table class="project-table"
                                         rowKey="project_id"
                                         size="small"
                                         :columns="projectTableColumns"
                                         :dataSource="filteredProjects"
                                         :loading="loadingPageData"
                                         :pagination="{pageSize: 10000, hideOnSinglePage: true, position: 'both', showTotal: total => `共 ${total} 项`}">
                            <span slot="award" slot-scope="text, record">
                                @{{ record.award ? record.award : '未获奖' }}
                            </span>
                                    <span slot="applicant" slot-scope="text, record">
                                        @{{ record.applicant_name }}
                                        <a-popover :title="record.applicant_name + '的联系方式'">
                                            <template slot="content">
                                                <table>
                                                    <tr>
                                                        <td width="30"><a-icon type="phone"/></td>
                                                        <td>@{{ record.applicant_tel }}</td>
                                                    </tr>
                                                    <tr>
                                                        <td><a-icon type="mail"/></td>
                                                        <td>@{{ record.applicant_email }}</td>
                                                    </tr>
                                                </table>
                                            </template>
                                            <a style="display: inline-block; font-size: 12px; min-width: 60px;" href="">联系方式</a>
                                        </a-popover>
                                        <br/>
                                    </span>
                                    <span slot="application_form" size="large" slot-scope="text, record">
                                <a :href="'/home/view-form?id=' + record.project_id" target="_blank">查看</a>
                            </span>
                                    <span slot="attachments" slot-scope="text, record">
                                <a :href="'/home/view-attachments?project_id=' + record.project_id" target="_blank">
                                    <span>查看</span>
                                </a>
                            </span>
                                    <span slot="score_time_costs" size="large" slot-scope="text, record">
                                <template v-for="reviewer_score in record.score_per_reviewer">
                                    <span v-html="formatScoreTimeCost(reviewer_score.score_time_cost)"/><br>
                                </template>
                            </span>
                                    <span slot="reviewer_scores" size="large" slot-scope="text, record">
                                <template v-for="reviewer_score in record.score_per_reviewer">
                                    <span>@{{ reviewer_score.score !== null ? reviewer_score.score : '-' }}</span><br>
                                </template>
                                <label v-if="!record.scores_normal"
                                       style="color: red;">@{{ record.scores_desc }}</label>
                            </span>
                                    <span slot="is_evidence_material_valid" size="large" slot-scope="text, record">
                                <template v-for="reviewer_score in record.score_per_reviewer">
                                    <label>@{{ reviewer_score.is_evidence_material_valid === null ? '-' :
                                        (reviewer_score.is_evidence_material_valid === 1 ? '是' : '否') }}</label>
                                    <br>
                                </template>
                            </span>
                                    <span slot="reviewer_remarks" size="large" slot-scope="text, record">
                                <template v-for="reviewer_score in record.score_per_reviewer">
                                    <a-textarea :disabled="true" :autosize="{minRows: 1, maxRows: 10}"
                                                v-model="reviewer_score.remark"/>
                                    <br>
                                </template>
                            </span>
                                    </span>
                                    {{--                            <span slot="score_status" size="large" slot-scope="text, record">--}}
                                    {{--                                @{{ record.score_status_phrase }}--}}
                                    {{--                                <template v-if="record.score_status == SCORE_STATUS_LEADER_REVIEW_REJECTED">--}}
                                    {{--                                    <br>(@{{ record.large_group_leader_review_remark }})--}}
                                    {{--                                </template>--}}
                                    {{--                            </span>--}}
                                    <span slot="meeting_review_status" size="large" slot-scope="text, record">
                                        <template v-if="record.toMeetingReview">
                                            @{{ REVIEW_STATUS_TO_REVIEW }}
                                        </template>
                                        <template v-else>
                                             @{{ record.meeting_review_status }}
                                            <template v-if="record.meeting_review_remark">
                                                <br>(@{{ record.meeting_review_remark }})
                                            </template>
                                        </template>
                                    </span>
                                </a-table>
                            </a-tab-pane>
                            <a-tab-pane key="2" tab="评审专家">
                                <div style="display: flex; position: relative; margin-top: 10px; margin-bottom:15px;align-items: center;">
                                    <!--@time 2020-06-15-->
                                    <!--@time 2020-06-15-->
                                    <!--@time 2020-06-15-->
                                    <a-button type="primary"
                                              size="small"
                                              @click="handleManualSelectReviewer"
                                              style="margin-left: 12px">
                                        添加评审专家
                                    </a-button>
                                </div>

                                <a-table class="reviewer-table"
                                         rowKey="id"
                                         size="small"
                                         :columns="reviewerTableColumns"
                                         :dataSource="reviewersData">


                                    <span slot="num" slot-scope="text,record,index">
                                        @{{ index+1 }}
                                    </span>
                                    <span slot="login_info" slot-scope="text,record,index">
                                        @{{ record.username }} / @{{ record.password }}
                                    </span>
                                    <span slot="prof_fields" slot-scope="text, record">
                                        @{{ record.prof_fields }}
                                    </span>
                                    <span slot="operations" slot-scope="text, record,index">
                                        <a @click="delReviewer(index,record.id)">删除</a>
                                    </span>

                                </a-table>

                            </a-tab-pane>
                        </a-tabs>
                    </div>

                </div>
            </main>

            <!--选择评审专家-->
            <!--选择评审专家-->
            <a-modal :width="1000"
                     v-model="selectReviewerDialogVisible"
                     title="选择评审专家"
                     @ok="selectReviewerDialogVisible = false">
                <div style="display: flex; position: relative; margin-bottom: 10px; align-items: center;">
                    <span style="flex: 1;"></span>
                    <a-input style="width: 300px;" placeholder="搜索" v-model="selectReviewerDialogSearchKeyword"/>
                    <a-icon v-if="selectReviewerDialogSearchKeyword"
                            style="position: absolute; top: 8px; right: 8px; color: #aaa; cursor: pointer;"
                            type="cross"
                            @click="selectReviewerDialogSearchKeyword = ''"/>
                </div>

                <a-table class="reviewer-table"
                         rowKey="id"
                         size="small"
                         :columns="candidateReviewerTableColumns"
                         :dataSource="filteredCandidateReviewers"
                         :loading="loadingCandidateReviewers"
                         :pagination="{pageSize: 10000, hideOnSinglePage: true, position: 'both', showTotal: total => `共 ${total} 项`}">

                    <span slot="prof_fields" slot-scope="text, record">
                        @{{ record.prof_fields }}
                    </span>
                    <span slot="operations" slot-scope="text, record,index">
                        <a @click="selectReviewer(index,record.id)">选择</a>
                    </span>

                </a-table>
            </a-modal>
            <!--选择评审专家-->
            <!--选择评审专家-->

            @include('admin.excel-export-tpl')
        </div>
    </a-locale-provider>
</script>
@include('admin.excel-export-js')
@include('common-js')
@include('admin.header-js')
@include('admin.aside-js')

<script>
    var queryParams = parseUrl(location.href).params;
    var awardsInfo = {!! json_encode(array_values(config('vars.awards')), JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT) !!};

    var projectTableColumns = [
        {
            width: 60,
            title: '名次',
            dataIndex: 'meeting_ranking',
        },

            @if($awardId == '1')
        {
            width: 60,
            title: '初始名次',
            dataIndex: 'meeting_initial_ranking'
        },
            @endif

        {
            width: 80,
            title: '获奖',
            scopedSlots: {
                customRender: 'award'
            }
        },
        {
            width: 150,
            title: '项目名称',
            dataIndex: 'project_name',
        },
        {
            width: 100,
            title: '申报者',
            dataIndex: 'applicant',
            scopedSlots: {
                customRender: 'applicant'
            }
        },
        {
            width: 60,
            title: '申报书',
            dataIndex: 'application_form',
            scopedSlots: {
                customRender: 'application_form'
            }
        },
        {
            width: 60,
            title: '附件',
            dataIndex: 'attachments',
            scopedSlots: {
                customRender: 'attachments'
            }
        },
        // {
        //     width: 100,
        //     title: '评分时长',
        //     dataIndex: 'score_time_costs',
        //     scopedSlots: {
        //         customRender: 'score_time_costs'
        //     }
        // },
        // {
        //     width: 70,
        //     title: '专家评分',
        //     dataIndex: 'reviewer_scores',
        //     scopedSlots: {
        //         customRender: 'reviewer_scores'
        //     }
        // },
        // {
        //     width: 70,
        //     title: '附件证明材料是否真实有效',
        //     dataIndex: 'is_evidence_material_valid',
        //     scopedSlots: {
        //         customRender: 'is_evidence_material_valid'
        //     }
        // },
        // {
        //     width: 200,
        //     title: '专家意见',
        //     dataIndex: 'reviewer_remarks',
        //     scopedSlots: {
        //         customRender: 'reviewer_remarks'
        //     }
        // },

            @if($awardId == '1')
        {
            width: 60,
            title: '平均分',
            dataIndex: 'avg_score',
        },
        @endif

        // {
        //     width: 80,
        //     title: '网评状态',
        //     dataIndex: 'score_status',
        //     scopedSlots: {
        //         customRender: 'score_status'
        //     }
        // },
        {
            width: 80,
            title: '会评状态',
            key: 'meeting_review_status',
            scopedSlots: {
                customRender: 'meeting_review_status'
            }
        },
        // {
        //     width: 100,
        //     title: '操作',
        //     key: 'operations',
        //     scopedSlots: {
        //         customRender: 'operations'
        //     }
        // }
    ];

    var candidateReviewerTableColumns = [
        {
            width: 60,
            title: '序号',
            dataIndex: 'num'
        },
        {
            width: 100,
            title: '姓名',
            dataIndex: 'name',
        },
        {
            width: 200,
            title: '单位',
            dataIndex: 'work_org_name',
        },
        {
            width: 100,
            title: '职务',
            dataIndex: 'prof_title',
        },
        {
            width: 150,
            title: '联系方式',
            dataIndex: 'tel',
        },
        {
            width: 200,
            title: '评审专业',
            dataIndex: 'prof_fields',
            scopedSlots: {
                customRender: 'prof_fields'
            }
        },
        {
            width: 150,
            title: '操作',
            dataIndex: 'operations',
            scopedSlots: {
                customRender: 'operations'
            }
        },
    ];

    var reviewerTableColumns = [
        {
            width: 60,
            title: '序号',
            dataIndex: 'num',
            scopedSlots: {
                customRender: 'num'
            }
        },
        {
            width: 100,
            title: '姓名',
            dataIndex: 'name',
        },
        {
            width: 200,
            title: '账户/密码',
            dataIndex: 'login_info',
            scopedSlots: {
                customRender: 'login_info'
            }
        },
        {
            width: 200,
            title: '单位',
            dataIndex: 'work_org_name',
        },
        {
            width: 100,
            title: '职务',
            dataIndex: 'prof_title',
        },
        {
            width: 150,
            title: '联系方式',
            dataIndex: 'tel',
        },
        {
            width: 200,
            title: '评审专业',
            dataIndex: 'prof_fields',
            scopedSlots: {
                customRender: 'prof_fields'
            }
        },
        {
            width: 150,
            title: '操作',
            dataIndex: 'operations',
            scopedSlots: {
                customRender: 'operations'
            }
        },
    ];

</script>

<script>
    var app = new Vue({
        el: '#app',
        template: '#appTemplate',
        data: {

            searchKeyword: '',

            reviewerTableColumns,
            reviewersData: [],
            candidateReviewers: [],
            selectReviewerDialogVisible: false,
            selectReviewerDialogSearchKeyword: '',
            loadingCandidateReviewers: false,
            candidateReviewerTableColumns,

            projectTableColumns,
            pageData: [],
            projectsCount: 0,
            loadingPageData: false,

            //@start excel export
            ExcelExportParam: {
                type: 'meeting_review',
                large_group_id: queryParams.large_group_id,
            },
            //@end excel export

            // 项目的专家组评分状态
            SCORE_STATUS_TO_SCORE: 1,
            SCORE_STATUS_ABNORMAL_SCORES: 2,
            SCORE_STATUS_TO_LEADER_REVIEW: 3,
            SCORE_STATUS_LEADER_REVIEW_PASSED: 4,
            SCORE_STATUS_LEADER_REVIEW_REJECTED: 5,

            LEADER_REVIEW_RESULT_PASSED: '通过',
            LEADER_REVIEW_RESULT_REJECTED: '不通过',

            REVIEW_STATUS_TO_REVIEW: '待评审',
            REVIEW_STATUS_PASSED: '通过',
            REVIEW_STATUS_REJECTED: '不通过',

            queryParams,
            awardsInfo,
            profCategories,

            asideSelectedKeys: queryParams.aside_key ? [queryParams.aside_key] : [],
            antdLocale: antd.locales.zh_CN,
            ...AdminHeader.data,
            ...AdminAside.data,
            ...ExcelExport.data
        },
        beforeMount() {
            this.loadAsideDefaultOpenKeys()
        },
        computed: {

            /**
             * 添加评审专家
             * @start
             */
            filteredCandidateReviewers() {
                let reviewers = this.filteredCandidateReviewersBySearch
                let num = 1;
                reviewers.forEach(reviewer => {
                    reviewer.num = num++
                });
                return reviewers
            },

            filteredCandidateReviewersBySearch() {
                let reviewers;
                if (this.selectReviewerDialogSearchKeyword) {
                    let q = this.selectReviewerDialogSearchKeyword.trim();
                    reviewers = this.candidateReviewers.filter(reviewer => {
                        let text = reviewer.name + reviewer.work_org_name + reviewer.prof_title + reviewer.tel + reviewer.prof_fields;
                        return text.toLowerCase().indexOf(q) != -1
                    })
                } else {
                    reviewers = this.candidateReviewers
                }
                return reviewers
            },
            /**
             * 添加评审专家
             * @end
             */


            filteredProjects() {
                var projects = this.searchFilteredProjects;
                if (this.profCategoryFilter) {
                    projects = projects.filter(project => {
                        return project.prof_category == this.profCategoryFilter
                    })
                }
                var num = 1;
                projects.forEach(project => {
                    project.num = num++
                });
                return projects
            },
            searchFilteredProjects() {
                var projects;
                if (this.searchKeyword) {
                    var q = this.searchKeyword.trim();
                    projects = this.pageData.filter(project => {
                        var text = project.project_name + project.applicant_name + project.applicant_org_name + project.applicant_tel + project.applicant_email;
                        return text.toLowerCase().indexOf(q) != -1
                    })
                } else {
                    projects = this.pageData
                }
                return projects
            },
        },
        mounted() {
            this.reloadAsideData()
            this.reloadPageData()
            this.reloadReviewersData()
        },
        methods: {
            reloadPageData() {
                this.loadingPageData = true;
                axios.post('/api/admin/get-meeting-project', {
                    large_group_id: queryParams.large_group_id
                }).then(response => {
                    let data = response.data;
                    if (data.ok) {
                        data.projects.forEach(project => project.toMeetingReview = project.meeting_review_status === this.REVIEW_STATUS_TO_REVIEW)
                        this.pageData = data.projects;
                    } else {
                        error('加载页面数据失败: ' + data.msg)
                    }
                    this.loadingPageData = false
                })
            },
            formatScoreTimeCost(scoreTimeCost) {
                if (scoreTimeCost === null) {
                    return '-'
                } else if (scoreTimeCost < 60) {
                    return `<span style="color: red;">${scoreTimeCost}秒</span>`
                } else if (scoreTimeCost < 3600) {
                    let minutes = parseInt(scoreTimeCost / 60);
                    let seconds = scoreTimeCost % 60;
                    let content = `${minutes}分钟${seconds}秒`;
                    return scoreTimeCost < 300 ? `<span style="color: red;">${content}</span>` : content
                } else if (scoreTimeCost < 86400) {
                    let hours = parseInt(scoreTimeCost / 3600);
                    let minutes = Math.round(scoreTimeCost % 3600 / 60);
                    return `${hours}小时${minutes}分钟`
                } else {
                    let days = parseInt(scoreTimeCost / 86400);
                    let hours = Math.round(scoreTimeCost % 86400 / 3600);
                    return `${days}天${hours}小时`
                }
            },

            /**
             * 添加评审专家
             * @start
             */
            reloadReviewersData() {
                this.loadingCandidateReviewers = true
                axios.post('/api/admin/get-meeting-reviewers', {
                    large_group_id: queryParams.large_group_id
                }).then(response => {
                    let data = response.data
                    if (data.ok) {
                        this.reviewersData = data.list
                    } else {
                        error('加载评审专家失败: ' + data.msg)
                    }
                    this.loadingCandidateReviewers = false
                })
            },

            handleManualSelectReviewer() {
                this.selectReviewerDialogVisible = true
                this.reloadCandidateReviewers()
            },
            reloadCandidateReviewers() {
                this.loadingCandidateReviewers = true
                axios.get('/api/admin/get-candidate-reviewers', {
                    params: {
                        isMeeting: 1,
                    }
                }).then(response => {
                    let data = response.data
                    if (data.ok) {
                        this.candidateReviewers = data.candidateReviewers
                    } else {
                        error('加载候选评审专家失败: ' + data.msg)
                    }
                    this.loadingCandidateReviewers = false
                })
            },
            selectReviewer(index, ReviewerId) {
                console.log(index)
                axios.post('/api/admin/select-meeting-reviewer', {
                    reviewer_id: ReviewerId,
                    large_group_id: queryParams.large_group_id
                }).then(response => {
                    let data = response.data
                    if (data.ok) {
                        success('已选择')
                        console.log(this.candidateReviewers[index])
                        this.reviewersData.push(this.candidateReviewers[index])
                        this.candidateReviewers.splice(index, 1)
                    } else {
                        error('选择失败: ' + data.msg)
                    }
                })
            },

            delReviewer(index, ReviewerId) {
                console.log(index)
                axios.post('/api/admin/del-meeting-reviewer', {
                    reviewer_id: ReviewerId,
                }).then(response => {
                    let data = response.data
                    if (data.ok) {
                        success('已删除')
                        this.reviewersData.splice(index, 1)
                    } else {
                        error('删除失败: ' + data.msg)
                    }
                })
            },
            /**
             * 添加评审专家
             * @end
             */

            ...AdminHeader.methods,
            ...AdminAside.methods,
            ...ExcelExport.methods
        }
    })
</script>

</body>
</html>